<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<title>title</title>
		<link rel="stylesheet" type="text/css" href="../../css/api.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/common.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/complaint_details.css"/>
		<style>
			body {
			}
			.color-1 {
				color: #6e6e6e;
			}
			.color-2 {
				color: #b4b4b4;
			}
			.color-3 {
				color: #ff0f2e;
			}
			.color-4 {
				color: #ff8000;
			}
			.color-5 {
				color: #999999;
			}
			.m-l{
				margin-left:13px;
			}
			.m-t {
				margin-top: 13px;
			}
			.handle-result-container {
				padding: 10px 15px;
			}
			.result-container {
				display: none;
				margin-top: 10px;
				padding: 15px 15px 0;
				border-top: #C2C2C2 1px solid;
			}
			.acms-des {
				word-wrap: break-word;
			}
		</style>
	</head>
	<body>
		<div class="commit-content-container">
			<div class="commit-content-title flex-container flex-between">
				<div id="acms-msg-1">
					--
				</div>
				<div id="acms-msg-2">
					--
				</div>
			</div>
			<div class="commit-content-msg">
				<div>
					<span class="commit-content-msg-title">报障电话：</span><span id="acms-msg-3" class="phone_style">-</span>
				</div>
				<div id="div-acms-msg-16">
					<span class="commit-content-msg-title">校园卡号：</span><span id="acms-msg-16">-</span>
				</div>
				<div>
					<span class="commit-content-msg-title">故障地点：</span><span id="acms-msg-4">--</span>
				</div>
				<div>
					<span class="commit-content-msg-title">具体地址：</span><span id="acms-msg-5">--</span>
				</div>
				<div>
					<span class="commit-content-msg-title">网络类型：</span><span id="acms-msg-6">--</span>
				</div>
				<div>
					<span class="commit-content-msg-title">报障时间：</span><span id="acms-msg-7">--</span>
				</div>
				<div>
					<span class="commit-content-msg-title">故障情况：</span><span id="acms-msg-8">--</span>
				</div>
				<div>
					<span class="commit-content-msg-title">故障描述：</span>
					<div id="acms-msg-9">
						--
					</div>
				</div>
			</div>
			<div  id="acms-msg-10-p" class="camera-container mg-t">
				<img class="camera-container-img" src=""  id="acms-msg-10"/>
				<div class="camera-container-delete"></div>
			</div>
		</div>
		<!-- 第一次处理结果（包括还没有处理） -->
		<div id="acms-c-1" class="result-container">
			<div>
				<span>处理员：</span><span id="acms-c-1-msg-1" class="color-4">--</span>
			</div>
			<div id="acms-c-1-sub-2">
				<div id="acms-c-1-msg-2-p" class="m-t color-5">
					<span>接障时间：</span><span id="acms-c-1-msg-2">--</span>
				</div>
				<div id="acms-c-1-msg-3-p" class="m-t color-5">
					<span>处理时间：</span><span id="acms-c-1-msg-3">--</span>
				</div>
				<div id="acms-c-1-msg-4-p" class="m-t color-5">
					<span>处理状态：</span><span id="acms-c-1-msg-4">--</span>
				</div>
				<div id="acms-c-1-msg-5-p">
					<div class="m-t color-5">
						处理情况：
					</div>
					<div class="m-t" id="acms-c-1-msg-5">
						--
					</div>
				</div>
				<div id="acms-c-1-msg-6-p" class="camera-container">
					<img class="camera-container-img" src=""  id="acms-c-1-msg-6"/>
					<div class="camera-container-delete"></div>
				</div>
			</div>
		</div>
		<!-- 第二次处理结果（包括还没有处理） -->
		<div id="acms-c-2" class="result-container">
			<div>
				<span>处理员：</span><span id="acms-c-2-msg-1" class="color-4">--</span>
			</div>
			<div id="acms-c-2-sub-2">
				<div id="acms-c-2-msg-2-p" class="m-t color-5">
					<span>接障时间：</span><span id="acms-c-2-msg-2">--</span>
				</div>
				<div id="acms-c-2-msg-3-p" class="m-t color-5">
					<span>处理时间：</span><span id="acms-c-2-msg-3">--</span>
				</div>
				<div id="acms-c-2-msg-4-p" class="m-t color-5">
					<span>处理状态：</span><span id="acms-c-2-msg-4">--</span>
				</div>
				<div id="acms-c-2-msg-5-p">
					<div class="m-t color-5">
						处理情况：
					</div>
					<div class="m-t acms-des" id="acms-c-2-msg-5">
						--
					</div>
				</div>
				<div id="acms-c-2-msg-6-p" class="camera-container">
					<img class="camera-container-img" src=""  id="acms-c-2-msg-6"/>
					<div class="camera-container-delete"></div>
				</div>
			</div>
		</div>
		<!-- 评分结果 -->
		<div id="acms-c-3" class="result-container">
			<div class="flex-container flex-center-v">
				<div class="color-5">
					报障评分：
				</div>
				<div class="m-l icon-xx icon-xx-n"></div>
				<div class="m-l icon-xx icon-xx-n"></div>
				<div class="m-l icon-xx icon-xx-n"></div>
				<div class="m-l icon-xx icon-xx-n"></div>
				<div class="m-l icon-xx icon-xx-n"></div>
			</div>
			<div>
				<div class="m-t color-5">
					评分描述：
				</div>
				<div class="m-t acms-des" id="acms-c-3-msg-1">
					--
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript" src="../../script/request.js"></script>
	<script type="text/javascript">
		var mCpId;
		apiready = function() {
			initData();
			requestCpDetails(mCpId);
		};
		function initData() {
			mCpId = api.pageParam.id;
		}

		function initView(data) {
			//状态
			var status = parseInt(data.status);
			//第一次处理状态
			var firstHandle = data.action_status;
			//第二次处理状态
			var secondHandle = data.two_action_status;
			//是否专派----- 根据是否二次受理来判断是否专派
			var isTurnOver = data.two == 0 ? false : true;
			var doc = document;
			//故障状态
			var msg_2 = doc.getElementById('acms-msg-2');
			showView(doc, data);
			//状态： 1 待处理 2.已受理 3 .处理中  4.已处理 5.疑难单 6.报障关闭 7.已完成
			switch(status) {
				case 1:
					msg_2.innerText = '待处理';
					msg_2.style.color = '#ff0f2e';
					showView1(doc, data, status, firstHandle);
					break;
				case 2:
					if (isTurnOver) {//已转派，显示二次受理
						msg_2.innerText = '二次受理';
						showView1(doc, data, status, firstHandle, isTurnOver);
						showView2(doc, data, status, secondHandle);
					} else {//未转派，显示已受理
						msg_2.innerText = '已受理';
						showView1(doc, data, status, firstHandle);
					}
					msg_2.style.color = '#ff8000';
					break;
				case 3:
					if (isTurnOver) {//已转派，显示二次处理中
						msg_2.innerText = '二次处理中';
						showView1(doc, data, status, firstHandle);
						showView2(doc, data, status, secondHandle);
					} else {//未转派，显示处理中
						msg_2.innerText = '处理中';
						showView1(doc, data, status, firstHandle);
					}
					msg_2.style.color = '#ff8000';
					break;
				case 4:
					if (isTurnOver) {//已转派，显示已二次处理
						msg_2.innerText = '已二次处理';
						showView1(doc, data, status, firstHandle);
						showView2(doc, data, status, secondHandle);
					} else {//未转派，显示已处理
						msg_2.innerText = '已处理';
						showView1(doc, data, status, firstHandle);
					}
					msg_2.style.color = '#ff8000';
					showView3(doc, data)
					break;
				case 5:

					msg_2.innerText = '疑难单';
					msg_2.style.color = '#ff8000';
					showView1(doc, data, status, firstHandle);
					showView2(doc, data, status, secondHandle);
					break;
				case 6:
					msg_2.innerText = '报障关闭';
					msg_2.style.color = '#b4b4b4';
					showView1(doc, data, status, firstHandle);
					break;
				case 7:

					msg_2.innerText = '已完成';
					msg_2.style.color = '#b4b4b4';
					if (isTurnOver) {//已转派，显示已二次已完成
						showView1(doc, data, status, firstHandle);
						showView2(doc, data, status, secondHandle);
					} else {//未转派，显示已完成
						showView1(doc, data, status, firstHandle);
					}
					showView3(doc, data);
					break;
			}
		}

		function showView(doc, data) {
			//报障用户名
			var msg_1 = doc.getElementById('acms-msg-1');
			//电话
			var msg_3 = doc.getElementById('acms-msg-3');
			//地点
			var msg_4 = doc.getElementById('acms-msg-4');
			//地址
			var msg_5 = doc.getElementById('acms-msg-5');
			//网络类型
			var msg_6 = doc.getElementById('acms-msg-6');
			//报障时间
			var msg_7 = doc.getElementById('acms-msg-7');
			//故障情况
			var msg_8 = doc.getElementById('acms-msg-8');
			//故障描述
			var msg_9 = doc.getElementById('acms-msg-9');
			//报障上传图片
			var msg_10 = doc.getElementById('acms-msg-10');
			var msg_10_p = doc.getElementById('acms-msg-10-p');
			msg_1.innerText = MyCom.dataFaultTolerant(data.nick_name);
			msg_3.innerText = MyCom.dataFaultTolerant(data.user_phone);
			msg_4.innerText = MyCom.dataFaultTolerant(data.warn_location);
			msg_5.innerText = MyCom.dataFaultTolerant(data.address);
			if (data.internet_type == 1) {
				msg_6.innerText = '宽带网络';
			} else {
				msg_6.innerText = 'WiFi';
			}
			msg_7.innerText = MyCom.dataFaultTolerant(data.dispatch_time);
			msg_8.innerText = MyCom.dataFaultTolerant(data.title);
			msg_9.innerText = MyCom.dataFaultTolerant(data.content);
			//校园卡号
			var msg16 = doc.getElementById('acms-msg-16');
				console.log(".......msg16............"+data.school_number);
				if(typeof(data.school_number) == 'undefined' || typeof(data.school_number) === ''){
						var divMsg16 = doc.getElementById('div-acms-msg-16');
	          divMsg16.style.display = 'none';
				}else {
						msg16.innerText = MyCom.dataFaultTolerant(data.school_number);
				}

			if (data.images == null) {
				msg_10_p.style.display = 'none';
			} else {
				msg_10_p.style.display = 'block';
				msg_10.src = data.images;
				msg_10.onclick = function() {
					openLargePicPg(data.images);
				}
			}
			msg_3.onclick = function() {
				MyCom.callPhone(data.user_phone);
			}
		}

		/**
		 * 打开大图页
		 * @param{String} url - 图片url
		 */
		function openLargePicPg(url) {
			console.log('------------1');
			api.openWin({
				name : 'ImageShow',
				url : '../ImageShow.html',
				pageParam : {
					'url' : url
				}
			});
		}

		/**
		 * 显示第一次处理结果
		 */
		function showView1(doc, data, status, firstHandle, isTurnOver) {
			console.log('------------showView1');
			//第一次处理结果容器
			var c1 = doc.getElementById('acms-c-1');
			var c1_sub_2 = doc.getElementById('acms-c-1-sub-2');
			//处理员
			var c1_msg_1 = doc.getElementById('acms-c-1-msg-1');
			//接障时间
			var c1_msg_2 = doc.getElementById('acms-c-1-msg-2');
			var c1_msg_2_P = doc.getElementById('acms-c-1-msg-2-p');
			//处理时间
			var c1_msg_3 = doc.getElementById('acms-c-1-msg-3');
			var c1_msg_3_P = doc.getElementById('acms-c-1-msg-3-p');
			//处理状态
			var c1_msg_4 = doc.getElementById('acms-c-1-msg-4');
			var c1_msg_4_P = doc.getElementById('acms-c-1-msg-4-p');
			//处理情况
			var c1_msg_5 = doc.getElementById('acms-c-1-msg-5');
			var c1_msg_5_P = doc.getElementById('acms-c-1-msg-5-p');
			//处理图片
			var c1_msg_6 = doc.getElementById('acms-c-1-msg-6');
			var c1_msg_6_P = doc.getElementById('acms-c-1-msg-6-p');
			c1.style.display = 'block';
			//状态： 1 待处理 2.已受理 3 .处理中  4.已处理 5.疑难单 6.报障关闭 7.已完成
			if (status == 1 || status == 6) {
				c1_sub_2.style.display = 'none';
				c1_msg_1.innerText = '未分配';
			} else if (status == 2 || status == 3) {
				if (isTurnOver) {
					c1_msg_1.innerText = MyCom.dataFaultTolerant(data.action_person) + MyCom.dataFaultTolerant(data.action_phone);
					c1_msg_2.innerText = MyCom.dataFaultTolerant(data.dispatch_time);
					c1_msg_3.innerText = MyCom.dataFaultTolerant(data.action_time);
					if (firstHandle) {
						c1_msg_4.innerText = '已解决';
					} else {
						c1_msg_4.innerText = '未解决';
					}
					c1_msg_5.innerText = MyCom.dataFaultTolerant(data.action_result);
					if (data.action_imges == null) {
						c1_msg_6_P.style.display = 'none';
					} else {
						c1_msg_6.src = data.action_imges;
					}
				} else {
					c1_msg_1.innerText = MyCom.dataFaultTolerant(data.action_person) + MyCom.dataFaultTolerant(data.action_phone);
					c1_msg_2.innerText = MyCom.dataFaultTolerant(data.dispatch_time);
					c1_msg_3_P.style.display = 'none';
					c1_msg_4_P.style.display = 'none';
					c1_msg_5_P.style.display = 'none';
					c1_msg_6_P.style.display = 'none';
				}
				c1_msg_1.onclick = function() {
					MyCom.callPhone(data.action_phone);
				}
			} else {
				c1_msg_1.innerText = MyCom.dataFaultTolerant(data.action_person) + MyCom.dataFaultTolerant(data.action_phone);
				c1_msg_2.innerText = MyCom.dataFaultTolerant(data.dispatch_time);
				c1_msg_3.innerText = MyCom.dataFaultTolerant(data.action_time);
				if (firstHandle) {
					c1_msg_4.innerText = '已解决';
				} else {
					c1_msg_4.innerText = '未解决';
				}
				c1_msg_5.innerText = MyCom.dataFaultTolerant(data.action_result);
				if (data.action_imges == null) {
					c1_msg_6_P.style.display = 'none';
				} else {
					c1_msg_6.src = data.action_imges;
				}
				c1_msg_1.onclick = function() {
					MyCom.callPhone(data.action_phone);
				}
			}
		}

		/**
		 * 显示二次处理结果
		 */
		function showView2(doc, data, status, secondHandle) {
			//第二次处理结果容器
			var c2 = doc.getElementById('acms-c-2');
			var c2_sub_2 = doc.getElementById('acms-c-2-sub-2');
			//二次-------处理员
			var c2_msg_1 = doc.getElementById('acms-c-2-msg-1');
			//二次-------接障时间
			var c2_msg_2 = doc.getElementById('acms-c-2-msg-2');
			var c2_msg_2_p = doc.getElementById('acms-c-2-msg-2-p');
			//二次-------处理时间
			var c2_msg_3 = doc.getElementById('acms-c-2-msg-3');
			var c2_msg_3_p = doc.getElementById('acms-c-2-msg-3-p');
			//二次-------处理状态
			var c2_msg_4 = doc.getElementById('acms-c-2-msg-4');
			var c2_msg_4_p = doc.getElementById('acms-c-2-msg-4-p');
			//二次-------处理情况
			var c2_msg_5 = doc.getElementById('acms-c-2-msg-5');
			var c2_msg_5_p = doc.getElementById('acms-c-2-msg-5-p');
			//二次-------处理图片
			var c2_msg_6 = doc.getElementById('acms-c-2-msg-6');
			var c2_msg_6_p = doc.getElementById('acms-c-2-msg-6-p');
			c2.style.display = 'block';
			//状态： 1 待处理 2.已受理 3 .处理中  4.已处理 5.疑难单 6.报障关闭 7.已完成
			if (status == 2 || status == 3) {
				c2_msg_1.innerText = MyCom.dataFaultTolerant(data.two_action_person) + MyCom.dataFaultTolerant(data.two_action_phone);
				c2_msg_2.innerText = MyCom.dataFaultTolerant(data.two_dispatch_time);
				c2_msg_3_p.style.display = 'none';
				c2_msg_4_p.style.display = 'none';
				c2_msg_5_p.style.display = 'none';
				c2_msg_6_p.style.display = 'none';
				c2_msg_1.onclick = function() {
					MyCom.callPhone(data.action_phone);
				}
			} else if (status == 4 || status == 7) {
				c2_msg_1.innerText = MyCom.dataFaultTolerant(data.two_action_person) + MyCom.dataFaultTolerant(data.two_action_phone);
				c2_msg_2.innerText = MyCom.dataFaultTolerant(data.two_dispatch_time);
				c2_msg_3.innerText = MyCom.dataFaultTolerant(data.two_action_time);
				if (secondHandle) {
					c2_msg_4.innerText = '已解决';
				} else {
					c2_msg_4.innerText = '未解决';
				}
				c2_msg_5.innerText = MyCom.dataFaultTolerant(data.two_action_result);
				if (data.two_action_imges == null) {
					c2_msg_6_p.style.display = 'none';
				} else {
					c2_msg_6.src = data.two_action_imges;
				}
				c2_msg_1.onclick = function() {
					MyCom.callPhone(data.action_phone);
				}
			} else if (status == 5) {
				c2_msg_1.innerText = '未分配';
				c2_sub_2.style.display = 'none';
			} else {
				MyCom.errorTip(1);
			}
		}

		/**
		 * 显示评价结果
		 */
		function showView3(doc, data) {
			var grade = data.point;
			var i = 0;
			//评分容器
			var c3 = doc.getElementById('acms-c-3');
			//评分描述
			var c3_msg_1 = doc.getElementById('acms-c-3-msg-1');
			//评分星星
			var xxs = doc.getElementsByClassName('icon-xx');
			if (grade == null) {
				c3.style.display = 'none';
				return;
			} else {
				c3.style.display = 'block';
			}
			for (; i < grade; i++) {
				xxs[i].className = 'm-l icon-xx icon-xx-s';
			}
			c3_msg_1.innerText = MyCom.dataFaultTolerant(data.advise);
		}

		/**
		 * 服务器请求：获取报障详情
		 * @param{Number} cpid - 故障id
		 */
		function requestCpDetails(cpid) {
			api.showProgress({
			});
			var data = {
				values : {
					'id' : cpid
				}
			};
			var url = $api.getStorage(MyCom.key_server) + MyRequest.URL_CP_DETAILS;
			MyRequest.requestMethod(url, data, function(re) {
				if (re) {
					console.log('获取报障详情--re=' + JSON.stringify(re));
					var code = re.code;
					if (code == 1) {
						initView(re.list[0]);
						api.hideProgress();
					} else {
						api.hideProgress();
						MyCom.errorTip(2);
					}
				} else {
					api.hideProgress();
					MyCom.errorTip(3);
				}
			});
		}
	</script>
</html>
